@import "./Loginpage";

main{
    @include web(1000px, auto);

    .maincode{
        height: 5308px;
    }
    
    .cgf p{
        text-align:center;
        font-size: 32px;
        color: $color;
        position: relative;
        bottom: 300px;
    }

    #cx{
        position: relative;
        right: 145px;
    }

    #wf{
        position: relative;
        left: 145px;
    }

    .radio{
        width: 100px;
        height: 50px;
        display: flex;
        flex-direction: row;
        margin: 0 auto;
        p{
            width: 20px;
            height: 20px;
            background-color:$color;
            border-radius: 50%;
            margin: 5px 5px;
            position: relative;
            bottom: 132px;
        }
    }

    .boxx{
        width: 900px;
        height: 32px;
        border-top: 1px solid $back;
        margin: 0 auto;
        position: relative;
        bottom: 100px;
        p{
            position: absolute;
            left:80px;
            font-weight: bold;
            line-height: 32px;
        }
    }

    .trapezoidal{
        width: 84px;
        height: 32px;
        background-color: $back;
        display:flex;
        justify-content: flex-end;
        position: relative;
        left: 48px;
        bottom: 132px;

        p::before{
            content: "当前位置";
            color: white;
            line-height: 32px;

        }

        &::after{
            content: "";
            width: 0px;
            border-style:  solid;
            border-width: 33px 16px 0 0;
            border-color: $back white transparent transparent ;
        }
    }

    .ptrapezoidal {
        position: relative;
        bottom: 100px;
    }

    @mixin font{
        font-size: 18px;  
    }

    @mixin trans{
        display:inline-block;
        transform: scale(0.7);  
    }

    .dingshou{
        text-align: center;
        margin-top: -80px;
        line-height: 22px;
        font-weight: bold;
        p{
            @include font;
        }
        span{
            @include trans;
        }
    }

    .boxxx{
        width: 160px;
        border-top: 1px solid $back;
        margin: 0 auto;
        margin-top: 10px;
    }


    @mixin boxxxx {
            width: 755px;
            border-style:  solid;
            border-width: 1px 15px 40px 15px;
            border-color: $back $back white $back;
            margin: 0 auto;
            margin-top: 42px;
        
    }

    .bod{
        @include boxxxx;
    }

    .customize{
        text-align: center;
        margin-top: -28px;
        line-height: 22px;
        font-weight: bold;
        p{
            @include font;
        }
        span{
            @include trans;
        }
    }

    .glfw{
        width: 750px;
        margin: 0 auto;
        margin-top: 38px;
        line-height: 28px;
    p:nth-child(1){
        text-align: center;
        margin-bottom: 20px;
        font-weight: bold;
    }

    }

    @mixin imgds {
        text-align: center;
        margin-top: 20px;
    }

    .imgggg{
        @include imgds;
    }

    .vision{
        text-align: center;
        margin-top: 38px;
        line-height: 22px;
        font-weight: bold;
        p{
            @include font;
        }
        span{
            @include trans;
        }
    }

    @mixin boxss {
        width: 755px;
        border-style:  solid;
        border-width: 40px 15px 1px 15px;
        border-color: white $back $back $back;
        margin: 0 auto;
        margin-top: -38px;
    }

    .bods{
        @include boxss;
    }

    .two{
        width: 750px;
        margin: 0 auto;
        margin-top: 38px;
        line-height: 25px;
    }

    .imgcx{
        @include imgds;
    }

    .boxss{
        @include boxxxx;
    }

    .wzsix{
        width: 120px;
        margin: 0 auto;
        margin-top: 18px;
        line-height: 40px;
    }
        
    .customizes{
        text-align: center;
        margin-top: 30px;
        line-height: 22px;
        font-weight: bold;
        p{
            @include font;
        }
        span{
            @include trans;
        }
    }

    .sixsix{
        width: 400px;
        margin: 0 auto;
        margin-top: 18px;
        line-height: 40px;
    }

    .end{
        text-align: center;
        margin-top: 30px;
        a{
            text-decoration: none;
            color: gray;
            margin: 10px 10px;
        }
    }

    
    
}